<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <!-- Tell the browser to be responsive to screen width -->
    <!-- Bootstrap 3.3.7 -->
    <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">
    <!-- iCheck -->
    <link rel="stylesheet" href="../../plugins/iCheck/square/blue.css">
    <script language="JavaScript">
        if (window != window.top)
            window.top.location.href = location.href;
    </script>
</head>
<body class="hold-transition login-page">
<div class="login-box">
    <!-- /.login-logo -->
    <div class="login-logo">
        <b>微服务管理系统</b>
    </div>
    <div class="login-box-body">
        <p class="login-box-msg">请登录</p>
        <form method="post" id="login-form">
            <div class="form-group has-feedback">
                <input type="text" class="form-control" placeholder="账户" maxlength="20" name="eid" id="eid">
                <span class="glyphicon glyphicon-user form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" class="form-control" placeholder="密码" minlength="6" maxlength="20" name="password" id="password">
                <span class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            <div class="row">
                <div class="col-xs-8">
                    <div class="checkbox icheck" style="margin-top: 6px !important;margin-bottom: 6px !important;">
                        <label>
                            <input type="checkbox" name="rememberMe" id="rememberMe"> 记住我
                        </label>
                    </div>
                </div>
                <!-- /.col -->
                <div class="col-xs-4">
                    <button type="button" class="btn btn-primary btn-block btn-flat" onclick="checkSubmit()">登录</button>
                </div>
                <!-- /.col -->
            </div>
        </form>

        <!-- /.social-auth-links -->
    </div>
    <!-- /.login-box-body -->
</div>
<!-- /.login-box -->

<!-- jQuery 3 -->
<script src="../../bower_components/jquery/dist/jquery.min.js"></script>
<script src="../../bower_components/jquery/dist/jQuery.cookie.js"></script>
<!-- Bootstrap 3.3.7 -->
<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- iCheck -->
<script src="../../plugins/iCheck/icheck.min.js"></script>
<script>
    $(function () {
        $('input').iCheck({
            checkboxClass: 'icheckbox_square-blue',
            radioClass: 'iradio_square-blue',
            increaseArea: '20%' /* optional */
        });
    });

    function checkSubmit() {
        //获取表单输入:用户名,密码,是否保存密码
        var eid = document.getElementById("eid").value.trim() ;
        var password = document.getElementById("password").value.trim() ;
        var rememberMe = document.getElementById("rememberMe").checked ;

        //判断用户名,密码是否为空(全空格也算空)
        if ( eid.length != 0 && password.length != 0 )
        {
            //若复选框勾选,则添加Cookie,记录密码
            if ( rememberMe == true )
            {
                setCookie ( "This is eid", eid, 7 ) ;
                setCookie ( eid, password, 7 ) ;
            }
            //否则清除Cookie
            else
            {
                delCookie ( "This is eid" ) ;
                delCookie ( eid ) ;
            }
            //return true ;
            window.location.href="list_page.html";
        }
        //非法输入提示
        else
        {
           // return false ;
           alert("请输入用户名密码");
        }
    };


    window.onload = function ()
    {
        //从Cookie获取到用户名
        var eid = getCookie("This is eid") ;
        //如果用户名为空,则给表单元素赋空值
        if ( eid == "" )
        {
            document.getElementById("eid").value="" ;
            document.getElementById("password").value="" ;
            document.getElementById("rememberMe").checked=false ;
        }
        //获取对应的密码,并把用户名,密码赋值给表单
        else
        {
            var password = getCookie(eid) ;

            document.getElementById("eid").value = eid ;
            document.getElementById("password").value = password ;
            document.getElementById("rememberMe").checked = true ;
        }
    }

    function setCookie ( name, value, expdays )
    {
        var expdate = new Date();
        //设置Cookie过期日期
        expdate.setDate(expdate.getDate() + expdays) ;
        //添加Cookie
        document.cookie = name + "=" + escape(value) + ";expires=" + expdate.toUTCString();
    }

    function getCookie ( name )
    {
        //获取name在Cookie中起止位置
        var start = document.cookie.indexOf(name+"=") ;

        if ( start != -1 )
        {
            start = start + name.length + 1 ;
            //获取value的终止位置
            var end = document.cookie.indexOf(";", start) ;
            if ( end == -1 )
                end = document.cookie.length ;
            //截获cookie的value值,并返回
            return unescape(document.cookie.substring(start,end)) ;
        }
        return "" ;
    }

    function delCookie ( name )
    {
        setCookie ( name, "", -1 ) ;
    }


</script>
</body>
</html>
